<!DOCTYPE html>
<html>
<head>
    <title>攻略系列</title>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <script src="/js/plugins/jquery/jquery.min.js"></script>
    <script src="/js/plugins/bootstrap-4.1.1-dist/js/bootstrap.min.js"></script>
    <script src="/js/plugins/jrender/jrender.min.js"></script>
    <script src="/js/plugins/dialog2/dialog.min.js"></script>
    <script src="/js/common.js"></script>

    <link rel="stylesheet" href="/js/plugins/bootstrap-4.1.1-dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="/css/font/css/font-awesome.min.css"/>
    <link rel="stylesheet" href="/css/reset.css"/>
    <link rel="stylesheet" href="/css/strategyCatalogs.css"/>
    <link rel="stylesheet" href="/js/plugins/dialog2/dialog.css"/>
    <link rel="stylesheet" href="/js/plugins/bootstrap-4.1.1-dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="/css/font/css/font-awesome.min.css"/>
    <link rel="stylesheet" href="/css/reset.css"/>
    <link rel="stylesheet" href="/css/strategyComment.css"/>
    <script>
        $(function () {
            var currentInput = $("#currentPage");
            currentInput.val(1);
            var Pages = 1;
            var travelArr = [];
            var user = JSON.parse(sessionStorage.getItem('user'));
            var params = getParams();
            $.ajax({
                url: "/messages/reads",
                async: false,
                data: {
                    authorId: user.id,
                    type: params.type
                },

                type: "PUT",
                success: function (data) {
                    if (data.success) {

                    } else {
                        $(document).dialog({
                            type: "notice",
                            infoText: data.msg,
                            autoClose: 1000
                        })
                    }
                }
            });
            function query() {
                var currentPage = currentInput.val();
                $.get("/messages/" + user.id + "/unRead", {
                    currentPage: currentPage,
                    state: 0,
                    type: params.type
                }, function (data) {
                    $.merge(travelArr, data.list);
                    if (data.pages == 0) {
                        $("#comment").html("");
                        $("#comment").html("还没有人给你评论哦!")
                    } else {
                        $("#comment").renderValues({list: travelArr}, {
                            getHref: function (item,value) {

                            }
                        });
                    }
                    Pages = data.pages;
                    //回复进入评论的评论界面
                    $(".travelClick").click(function () {
                        var tid = $(this).attr("tid");
                        var prev = $(this).prev();
                        var uid = $(prev).attr("uid");
                        $.ajax({
                            async: true,
                            url: "/travels/" + tid + "/" + uid + "",
                            type: "GET",
                            success: function (data) {
                                window.location.href = "/travelComment.html?id=" + data;
                            }
                        });
                    });
                });
                currentInput.val(parseInt(currentPage) + 1);
            }
            //回复评论
            query();
            $(window).scroll(function () {
                if ($(document).scrollTop() + $(window).height() >= $(document).height()) {
                    if (currentInput.val() <= Pages) {
                        query();
                    } else {
                        $(document).dialog({
                            type: "notice",
                            infoText: "已经到底啦",
                            autoClose: 1000
                        })
                    }
                }
            });
        });
    </script>
</head>
<body>
<div class="search-head">
    <div class="row nav-search">
        <div class="col-2">
            <a href="/mine/message.html">
                <span><i class="fa fa-chevron-left fa-2x"></i></span>
            </a>
        </div>
        <div class="col">
            <span>评论我的</span>
        </div>
    </div>
</div>
<input type="hidden" name="currentPage" id="currentPage" value="1">
<div class="tab-content " id="pills-tabContent">
    <div class="tab-pane fade show active" id="pills-comment">
        <div id="comment">
            <div render-loop="list">
                <div>
                    <div class="container row comment">
                        <div class="col-2 comment-head">
                            <a data-href="/userProfiles.html?id=" render-key="list.sender.id"
                               render-fun="getHref">
                                <div class="row" style="position: relative;left: 25px;top: 10px">
                                <span render-html="list.sender.nickName"></span>
                                </div>
                                <img class="rounded-circle" render-src="list.sender.headImgUrl">
                            </a>
                            <button class="btn" id="followBtn"><i class="fa fa-hand-o-right"> </i> 关注</button>
                        </div>
                        <div class="col">
                            <span class="comment-date" render-html="list.date"></span>
                            <div class="comment-content">
                                <p render-html="list.content"></p>
                            </div>
                            <ul class="comment-img">
                            </ul>
                            <div class="comment-link">
                                <a class="travelAId" data-href="/travelContent.html?id=" render-key="list.travel.id"
                                   render-fun="getHref">
                                    <img render-src="list.travel.coverUrl">
                                    <span render-html="list.travel.title"></span>
                                    <i class="fa fa-angle-right fa-2x"></i>
                                </a>
                            </div>
                            <div class="d-flex icon replyComment">
                                <span id="uid" render-attr="uid=list.sender.id"></span>
                                <a class="travelClick" render-attr="tid=list.travel.id">
                                    <i class="fa  fa-commenting-o " style="margin-right: 10px"> 回复 </i>
                                    <i class="fa fa-thumbs-o-up "> <span render-html="list.travel.praiseNum">0</span>
                                    </i>
                                </a>
                            </div>
                        </div>
                    </div>
                    <hr style="background-color:beige"/>
                </div>
            </div>
        </div>
    </div>
</div>
</div>
</body>
</html>